/*!
 * SPDX-License-Identifier: Apache-2.0
 *
 * The OpenSearch Contributors require contributions made to
 * this file be licensed under the Apache-2.0 license or a
 * compatible open source license.
 *
 * Modifications Copyright OpenSearch Contributors. See
 * GitHub history for details.
 */

.ouiSimplifiedBreadcrumbs {
  @include ouiFontSizeS;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: $ouiSizeS; // sass-lint:disable-line no-misspelled-properties
  min-width: 0; // Ensure it shrinks if the window is narrow
  margin-left: 0;

  .ouiLink.euiLink--text:focus {
    animation: none;
    background: none;
  }

  &--truncate {
    white-space: nowrap;
    flex-wrap: nowrap;

    .ouiSimplifiedBreadcrumb:not(.ouiSimplifiedBreadcrumb--collapsed) {
      width: 100%;
      max-width: fit-content;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }
}

.ouiSimplifiedBreadcrumb {
  display: block;

  &.ouiLink {
    line-height: inherit;
    font-weight: inherit;

    &[class*='ouiLink--']:focus {
      // .ouiLink uses a rule with !important
      background-color: unset !important; // sass-lint:disable-line no-important
      animation: none !important; // sass-lint:disable-line no-important
    }
  }

  &--collapsed {
    flex-shrink: 0;
    color: $ouiBreadcrumbCollapsedLink !important; // sass-lint:disable-line no-important
    vertical-align: top !important; // sass-lint:disable-line no-important

    &:hover {
      color: $ouiBreadCrumbHoverColor !important; // sass-lint:disable-line no-important
    }
  }

  &--truncate {
    @include ouiTextTruncate;
    max-width: 100%;
    text-align: center;
    vertical-align: top; // overflow hidden causes misalignment of links and slashes, this fixes that
  }
}

.ouiBreadcrumbSeparator {
  flex-shrink: 0;
  width: 8px; // The width of the SVG's bounding box
  color: $ouiColorDisabledText;
  height: $ouiFontSizeXS; // One size smaller the font size used by .ouiSimplifiedBreadcrumbs
}
